import React from "react";
import './index.css'
import { DatePicker, List } from "antd-mobile";
import enUs from 'antd-mobile/2x/es/locales/en-US';

// import DatePicker from 'react-datepicker';
// import 'react-datepicker/dist/react-datepicker.css';

export default function DateModal({ title, type, dateSelected, onItemClick, onCloseClick }) {

    return (
        <div className="dateModalRoot">
            <div className="dateModalTransparent"></div>
            <div className="dateModalContent">
                <h2 className="dateModalTitle">{title}</h2>
                <div className="dateModalList">
                    <DatePicker
                        mode="date"
                        value={dateSelected}
                        onChange={date => onItemClick(type, date)}
                        dateFormat="yyyy-MM-dd"
                    >
                        <div onClick={() => { }}>日期</div>
                    </DatePicker>

                    {/* {dataList.map((value, index) => {
                        return (
                            <div className="dateModalListRow"
                                key={index}
                                onClick={() => onItemClick(type, dataList[index])}>
                                <span className="dateModalListTitle">{dataList[index].title}</span>
                                <div className="dateModalListLine"></div>
                            </div>
                        )
                    })} */}
                </div>
                <button onClick={onCloseClick}>Close</button>
            </div>
        </div>
    )
}